連結簡單來說，就是由一個網頁連到另一個網頁。
連結有分為以下幾種類型:

• 不同網站之間的連結。
• 同一個網站內，不同網頁之間的連結。
• 同一個網頁內，不同區域之間的連結。
• 開始一個新瀏覽器視窗的連結。
• 可以啟動電子郵件軟體並寫信給他人的連結。

連結到其他網站

連結是用<a>元素製作，元素裏面包含了href屬性，href屬性的值就是使用者點擊後會連結到的頁面位置。
一般連結寫法如下:

<a href="連結的網址或位置">使用者點擊的文字</a>

*註:連結不一定要是html，也可以是影片或圖片，只要改上對應的檔案位置與副檔名即可。

例如:

<a href="http://www.google.com">Google</a>
<a href="http://tw.yahoo.com">Yahoo奇摩</a>

會顯示為下方
Google
Yahoo奇摩

連到同一網站的不同網頁

若是要連結到同一個網站裡的其他網站，不需要指定網域名稱，可使用稱為"相對URL"的捷徑。

相對連結及類型

也就是要連結的網頁相對於目前網頁的位置。

類型一:

如果網站中的所以檔案都在同資料夾下的話，只要使用該網頁檔名即可。

例如:

<a href="檔名.html">連結名稱</a>

類型二:

子資料夾:使用子資料夾名稱加上斜線，然後再加上檔名。

例如:

<a href="子資料夾/檔名.html">連結名稱</a>

類型三:

孫資料夾:使用孫資料夾名稱加上斜線，然後再加上檔名。

例如:

<a href="子資料夾/孫資料夾/檔名.html">連結名稱</a>

類型四:

父資料夾:使用../來表示回到目前資料夾的上一層，然後加上檔名。

例如:

<a href="../檔名.html">連結名稱</a>

類型五:
祖資料夾:再次重複../來表示你要回到上兩層，再加上檔名。

例如:

<a href="../../檔名.html">連結名稱</a>

Email連結

直接製作Email連結，點擊後會跳出電子郵件軟體並在Email位置輸入收件者地址。

<a href="mailto:電子郵件地址">連結名稱</a>

在新視窗開啟連結

使用target屬性，並將值的位置加上_blank。

<a href="連結位置" target="_blank">連結名稱</a>

連結到同網站的某部分

如果頁面很長，想要讓人可以快速點到區域位置，或是要再頁面底下加入可以跳回頁面頂端的連結等等，
就可以使用此方法來達成。
方式是使用id屬性(可使用在任何html元素上)，id屬性的值必須以字母或是下滑線為開頭，不能使用數字
或是其他字元，在href的值須以#為開頭。此外，在單一網頁中兩個id屬性不能有相同的詞。
使用id屬性的方法如下面舉例:

<h1 id="top">頁首</h1>
此為在h1元素中加入id屬性並給予值
<a href="#top">回到頁首</a>
點擊此連結後會回到元素內有id="top"的位置

連結到另一個網站的特定區域

如果想連結到另一個網站的特定區域，只要連結目標網頁內有id屬性，就可以在該頁面的連結結尾處加入
相同語法。
舉例來說，如果連結的目標網站網址為 http://www.h1144777.com ，網頁中間文章的元素後面有加上
id="interlude"，就可以寫成如下:

<a href="http://www.h1144777.com/#interlude">

點擊後就會跑到目標網站指定id的位置。

參考來源:
書籍:HTML&CSS 網站設計建置優化之道
網頁前端工程入門：基礎 HTML 教學 By 彭彭